<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title></title>
    <link href="${basePath}/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="${basePath}/css/scrollbar.css">
    <script src="${basePath}/js/city.js"></script>
  </head>
  <body>
  	<div style="width:85%;margin: 0px auto;">
		  <img src="${headimagePath}/${friend.headimage}" alt="头像" class="img-thumbnail"
		  	style="width: 120px;height: 120px;margin: 30px auto 20px auto;display: block;">
			<div style="width:100%;margin: 20px auto 20px auto;">
			  <div class="panel panel-default">
				  <div class="panel-heading"><h3 class="panel-title">用户名</h3></div>
				  <div class="panel-body">${friend.username}</div>
				</div>
				<div class="panel panel-default">
				  <div class="panel-heading"><h3 class="panel-title">昵称</h3></div>
				  <div class="panel-body">${friend.nickname}</div>
				</div>
			  <div class="panel panel-default">
				  <div class="panel-heading"><h3 class="panel-title">签名</h3></div>
				  <div class="panel-body">${friend.signature}</div>
				</div>
				<div class="panel panel-default">
				  <div class="panel-heading"><h3 class="panel-title">性别</h3></div>
				  <div class="panel-body"><c:if test="${friend.sex==0}">男</c:if><c:if test="${friend.sex==1}">女</c:if></div>
				</div>
				<div class="panel panel-default">
				  <div class="panel-heading"><h3 class="panel-title">地区</h3></div>
				  <div class="panel-body"><span id="city"></span></div>
				</div>
				<button type="button" class="btn btn-success btn-block btn-lg" style="width: 250px;margin: 20px auto 15px auto;" onclick="location.href='${basePath}/ssnchat/${friend.id}'">发送消息</button>
				<button type="button" class="btn btn-danger btn-block btn-lg" style="width: 250px;margin: 15px auto 15px auto;" onclick="location.href='${basePath}/delfriend/${friend.id }'">删除</button>
		 		<button type="button" class="btn btn-default btn-block btn-lg" style="width: 250px;margin: 15px auto 30px auto;" onclick="location.href='${basePath}/friend'">返回</button>
			</div>
		</div>
    <script src="${basePath}/js/jquery.min.js"></script>
    <script src="${basePath}/js/bootstrap.min.js"></script>
    <script type="text/javascript">
  		var p=parseInt(parseInt("${friend.city}")/100);
  		var c=parseInt(parseInt("${friend.city}")%100);
   		document.getElementById("city").innerHTML = province[p]+" "+city[p][c];
   </script>
  </body>
</html>